<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>初识vue</title>
    <script type="text/javascript" src="../js/vue.js"></script>  <!--引入一个开发版本的vue-->
</head>
<body>
    <div id ="root">
        <h1>hello world!!!</h1>
        <h2>姓名：{{name}}</h2> <!--插值语法-->
        <h2>姓名：{{name}}</h2> <!--插值语法-->
        <h2>年龄：{{age}}</h2>
        <a href="http://www.atguigu.com">去学习</a>
        <a v-bind:href="url">去学习1</a>
        <a :href="url">去学习1</a> <!--简写v-bind-->
    </div>
    <script type="text/javascript">
        Vue.config.productionTip = false //阻止vue启动时生成生产提示

        new Vue({
            el: '#root',
            data:{
                name: "zhangsan",
                age: 23,
                url: "http://www.atguigu.com",
                school:{
                    name: "qinghua",  //注意这里是字符串，不能写成：name: qinghua 否则报字段not defined
                    address: "beijing"
                }
            }
        })
    </script>
</body>
</html>
